<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="shortcut icon" href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/logo.png"/>
	<title>关注商品</title>
	<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/mui/js/mui.min.js"></script>
	<link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/frame/mui/css/mui.min.css" rel="stylesheet" />
	<link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/css/other/all.css" rel="stylesheet" />
    <link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/css/other/app.css" rel="stylesheet" />
    <link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/css/app.css" rel="stylesheet" />
	<link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/font/iconfont.css" rel="stylesheet" />
	<link href="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/css/other/ydui.css?rev=@@hash" rel="stylesheet" />
</head>
<style type="text/css">
	.mui-table-view-cell{
		padding-right: 10px!important;
	}
    .mui-content { padding-bottom: 0; }
    .productl{padding: 0;padding-left: 10px;padding-right: 0!important}
    .goto{padding: 10px 10px 10px 0 !important;}
    {{if eq .type "collect"}}
    #product{display: block;}
    #shop{display: none;}
    {{else}}
     #product{display: none;}
    #shop{display: block;}
    {{end}}
    .nocf{height: 55vw;background: url('/static/wechat/img/nocf.png') no-repeat;background-size: 55%;background-position: center;width: 100%;
    display:{{if .collect}}none{{else}}block;{{end}}}
    .nocf2{height: 55vw;background: url('/static/wechat/img/nocf.png') no-repeat;background-size: 55%;background-position: center;width: 100%;
    display:{{if .focus}}none{{else}}block;{{end}}}
    .rcmdPrdList dl .x{position: absolute;top: 2.5px;right:2.5px;z-index: 9;width: 30px;height: 30px;}
</style>
<body>
<div class="followstore">
	<a class="qh {{if eq .type "collect"}}on{{end}}" data-type="product" href="javascript:void(0)"><span>商品</span></a>
	<a class="qh {{if eq .type "focus"}}on{{end}}" data-type="shop" href="javascript:void(0)"><span>店铺</span></a>
</div>
<div class="collect" id="product">
    <p class="fav_count">共 <span id="cpnum">{{(.collect|len)}}</span> 件商品</p>
    <div class="mui-content likegood">
        <div class="PrdLineStyle">
            <ul class="mui-table-view mui-table-view-chevron PrdLineStyle" id="cf1" style="margin-top: 0">
                {{range .collect}}
                <li class="mui-table-view-cell productl">
                    <div class="mui-slider-right mui-disabled">
                        <a class="mui-btn mui-btn-red" data-id="{{.cid}}" data-table="mt_member_collection" href="javascript:void(0)">取消</a>
                    </div>
                    <div class="mui-slider-handle">
                        <a href="/mobile/column/product_content?id={{.pid}}">
                        <dl class="goto">
                            <dt><img src="{{.pathname}}" alt=""></dt>
                            <dd>
                                <p>{{.title}}</p>
                                <p>{{range .keywords}}<span>{{.}}</span>{{end}}
                                <p><span><span>&yen;</span>{{if .vprice}}{{.vprice}}{{else}}{{.price}}{{end}}</span>{{.sellnum}}人购买</p>
                                <p>{{if .gname}}{{.gname}} {{.shen}}{{else}}{{$.system.name}} {{$.system.shen}} {{end}}<a href="/mobile/index/shop?id={{.gid}}">进店<i class="iconfont">&#xe7bb;</i></a></p>
                            </dd>
                        </dl>
                        </a>
                    </div>
                </li>
                {{end}}
            </ul>
        </div>
        <div class="nocf"></div>
        <h1>猜你喜欢</h1>
        <section class="g-scrollview">
        <div class="rcmdPrdList">
            {{range .productp}}
            <a href="/mobile/column/product_content?id={{.id}}">
            <dl>
                <dt>
                    <img src="{{.pathname}}" alt="">
                </dt>
                <dd>
                    <p>{{.title}}</p>
                    <p>{{if .vprice}}
                            <span>&yen; {{.vprice}}</span><s>&yen; {{.price}}</s>
                            {{else}}
                            <span>&yen; {{.price}}</span>
                            {{end}}</p>
                    <p>好评率{{.hp}}%</p>
                </dd>
                {{if eq .active 1}}
                <img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/gbuy.png" class="x">
                {{else if eq .active 2}}
                <img src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/img/sales.png" class="x">
                {{end}}
            </dl>
            </a>
            {{end}}
        </div>
        </section>
    </div>
</div>
<div id="shop">
    <p class="fav_count">您关注了 <span id="dpnum">{{(.focus|len)}}</span> 个店铺</p>
    <div class="mui-content likestore">
        <ul class="mui-table-view mui-table-view-chevron" id="cf2" style="margin-top: 0">
            {{range .focus}}
            <li class="mui-table-view-cell shops">
                <div class="mui-slider-right mui-disabled">
                    <a class="mui-btn mui-btn-red" data-id="{{.id}}" data-table="mt_member_focus" href="javascript:void(0)">取消</a>
                </div>
                <div class="mui-slider-handle">
                <a href="/mobile/index/shop?id={{.gid}}">
                        <img class="mui-media-object mui-pull-left" src="{{.pathname}}">
                        <div class="mui-media-body">
                            {{.name}}
                            <p class='mui-ellipsis'>{{.num}}人关注</p>
                        </div>
                </a>
                </div>
            </li>
            {{end}}
        </ul>
         <div class="nocf2"></div>
        <h1>——————— <span>您可能喜欢的店铺</span> ———————</h1>
        {{range .shopp}}
        <div class="like">
            <div class="header">
                <a href="/mobile/index/shop?id={{.id}}">
                    <img src="{{.pathname}}">
                    <div>
                        <p class="overpl1">{{.name}}</p>
                        <p class="overpl1">销量{{.sellnum}} &nbsp;&nbsp;&nbsp;&nbsp;共{{.pnum}}商品</p>
                    </div>
                </a>
                <span></span>
            </div>
            <ul>
                {{range .product}}
                <li><a href="/mobile/column/product_content?id={{.id}}"><img src="{{.pathname}}"></a>
                </li>
                {{end}}
            </ul>
        </div>
        {{end}}
    </div>
</div>

{{template "wechat/public/share.html" .}}
<script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/js/other/app.js"></script>
<!-- <script src="https://tcsc.oss-cn-hangzhou.aliyuncs.com/static/wechat/js/other/ydui.flexible.js"></script> -->
<script>
    var product=document.getElementById('product')
    var shop=document.getElementById('shop')
    var qh=document.getElementsByClassName('qh')
    mui('body').on('tap', '.qh',function(){
        var cls=this.getAttribute('class')
        console.log(cls)
        if (cls=='qh on'){
            return false;
        }else{   
            var type=this.getAttribute('data-type')
            if (type=='product'){
                product.style.display = 'block'
                shop.style.display = 'none'
            }else{
                product.style.display = 'none'
                shop.style.display = 'block'
            }
            for (var i=0;i<qh.length;i++){
                qh[i].setAttribute('class', 'qh')
            }
            this.setAttribute('class', 'qh on')
        }
    })
    mui('body').on('tap','.mui-btn-red',function(){
        var id=this.getAttribute('data-id')
        var table=this.getAttribute('data-table')
        var that=this
        that.disabled=true
        mui.confirm("确定要取消关注吗?","提示",function(data){
            if(data.index){
                mui.ajax(window.location.href,{
                    data:{id:id,table:table},
                    type:'post',
                    timeout:10000,
                    success:function(res){
                        if(res.status==1){
                            mui.toast('取消成功~')
                            var ddom=that.parentNode.parentNode
                            ddom.parentNode.removeChild(ddom)
                            if (table=="mt_member_collection") {
                               if(document.getElementsByClassName('productl').length==0){
                                    document.getElementsByClassName('nocf')[0].style.display='block'
                                    document.getElementById('cf1').style.display='none'
                               }
                               document.getElementById('cpnum').innerHTML=res.num
                            }else{
                                if(document.getElementsByClassName('shops').length==0){
                                    document.getElementsByClassName('nocf2')[0].style.display='block'
                                    document.getElementById('cf2').style.display='none'
                               }
                               document.getElementById('dpnum').innerHTML=res.num
                            }
                        }else{
                            mui.toast('网络繁忙,请稍后再试~')
                        }
                         that.disabled=false
                    },error:function(){
                          mui.toast('网络繁忙,请稍后再试~')
                          that.disabled=false
                    }
                })
            }else{
                that.disabled=false
            }
        })
    })
</script>
<div class="mt-statistics">统计代码</div>
</body>
</html>